﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>题库管理</title>
    <link href="../css/main.css" rel="stylesheet" type="text/css" />
    <link href="../css/Jqbox.css" rel="stylesheet" type="text/css" />
    <link href="../css/jquery.loadmask.css" rel="stylesheet" type="text/css" />
    <script src="../js/jquery-1.5.2.min.js" type="text/javascript"></script>
    <script src="../js/ligerui.min.js" type="text/javascript"></script>
    <script src="../Js/jquery.dialog.js" type="text/javascript"></script>
    <script src="../Js/conmon.js" type="text/javascript"></script>
    <script src="../Js/jquery.loadmask.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var $grid;
        var maiheight = 500;
        var $selectRow = null;
        var IsView = false;
        var exportUrl = "";
        var tree = null;


        function Init_GridParams() {
            $grid.setOptions({ parms: [
                                { name: 'beginDate', value: $("#txtBeginDate").val() },
                                { name: 'endDate', value: $("#txtEndDate").val() },
                                { name: 'typeID', value: $("#typeID").val() },
                                { name: 'roleID', value: $("#roleID").val() },
                                { name: 'title', value: $("#txtTitle").val() },
                                { name: 'status', value: $("#lstStatus").val() }
                               ],
                newPage: 1, Rows: [], Total: 0
            });  //设置数据参数
        }

        $(function () {
            $("#txtBeginDate").ligerDateEditor({ format: "yyyy-MM-dd" });
            $("#txtEndDate").ligerDateEditor({ format: "yyyy-MM-dd" });
            maiheight = $(window).height();

            $("#layout1").ligerLayout({ leftWidth: 170, heightDiff: -0 });

            $("#form1").ligerForm();

            //显示gride
            $grid = $("#maingrid").ligerGrid({
                columns: [
               { display: '序号', align: 'left', width: 40, type: 'int', isSort: false,
                   render: function (item, i) {
                       i = i + 1;
                       return i;
                   }
               },
                { display: '题目', name: 'title', align: 'left', width: 380 },
                { display: '题型', name: 'type', width: 100,
                    render: function (item) {
                        var topic_type_name = "";
                        switch ( parseInt(item.type) ) {
                            case 1:
                                topic_type_name = "单选题";
                                break;
                            case 2:
                                topic_type_name = "多选题";
                                break;
                            case 3:
                                topic_type_name = "判断题";
                                break;
                            case 4:
                                topic_type_name = "填空题";
                                break;
                            case 5:
                                topic_type_name = "问答题";
                                break;
                            case 6:
                                topic_type_name = "打字题";
                                break;
                        }
                        return topic_type_name;
                    }
                },
                { display: '创建日期', name: 'date', dateFormat: "yyyy-MM-dd", width: 100 },
                { display: '状态', name: 'status', isSort: false, width: 80,
                    render: function (item) {
                        if (item.status == 0) return "√";
                        else if (item.status == 1) return "×";
                    }
                },
                { display: '停/启用', name: 'id', isSort: false, width: 80,
                    render: function (item) {
                        if (item.status == 0)
                            return "<a onclick='SetTopicSatus(" + item.id + ",1);' href='javascript:' >停用</a>";
                        else if (item.status == 1)
                            return "<a onclick='SetTopicSatus(" + item.id + ",0);' href='javascript:' >启用</a>";
                    }
                }
                ],
                parms: [
                      { name: 'beginDate', value: $("#txtBeginDate").val() },
                      { name: 'endDate', value: $("#txtEndDate").val() },
                      { name: 'typeID', value: '0' },
                      { name: 'roleID', value: '0' },
                      { name: 'title', value: $("#txtTitle").val() },
                      { name: 'status', value: $("lstStatus").val() }
                     ],
                dataAction: 'server', pageSize: 20,
                url: '../WebServer/TopicMng.ashx?Action=TopicRoleList&rnd=' + Math.random().toString(),
                sortName: 'id',
                width: '100%', height: '95%',
                onDblClickRow: function (data, rowindex, rowobj) {
                    ViewTopic(data.id , data.type );
                }
            });
            init_layout("layout");
            init_treepanel("treePanel");

            loadTree();

        });

        var height = 0;
        // 布局
        function init_layout(layout_id) {
            $("#" + layout_id).ligerLayout({
                leftWidth: 160,
                height: '100%',
                allowLeftCollapse: false,
                allowLeftResize: false,
                onHeightChanged: t_hight
            });
            height = $(".l-layout-center").height();
        }
        // 变高函数
        function t_hight(options) {
            // 改变树容器高度
            if (treepanel && options.middleHeight - 40 > 0)
                treepanel.setHeight(options.middleHeight - 40);
        }

        //////////////////////////////////////////////////////////////////////////
        //  初始化树面板
        function init_treepanel(treepanel_id) {
            $("#" + treepanel_id).ligerAccordion({ height: height - 24, speed: null });
            treepanel = $("#" + treepanel_id).ligerGetAccordionManager();
        }


        function reloadtree() {
            // tree.loadData(null, '../WebServer/TopicMng.ashx?Action=TopicRoleTree&rnd=' + Math.random().toString(), null);
            loadGrid();
        }


        function loadTree() {
            tree = $("#treePanel").ligerTree({
                checkbox: false,
                slide: false,
                nodeWidth: 100,
                url: '../WebServer/TopicMng.ashx?Action=TopicRoleTree&rnd=' + Math.random().toString(),
                onSelect: function (node) {
                    $("#typeID").val(node.data.id);
                    $("#roleID").val(node.data.role);
                    $("#txtBeginDate").val("");
                    $("#txtEndDate").val("");
                    $("#txtTitle").val("");
                    $("#lstStatus").val("-1");
                    loadGrid();
                }
            });

            tree = $("#treePanel").ligerGetTreeManager();
        }

        function Search() {
            var node = tree.getSelected();
            if (node == null) {
                $("#typeID").val("-1");
                $("#roleID").val("-1");
            }
            loadGrid();
        }

        function loadGrid(aid, rolid) {

            if (!$grid) return;
            $("tbody > tr", $grid.gridbody).each(function () {
                $(this).remove();
            });
            //设置数据参数
            Init_GridParams();
            $grid.loadData(true); //加载数据
        }

        function GetEditPage(typeID) {
            if (typeID == 1)
                return "Topic/EditTopicSingle.htm";
            else if (typeID == 2)
                return "Topic/EditTopicMulti.htm";
            else if (typeID == 3)
                return "Topic/EditTopicJudge.htm";
            else if (typeID == 4)
                return "Topic/EditTopicFillBlank.htm";
            else if (typeID == 5)
                return "Topic/EditTopicQA.htm";
            else if (typeID == 6)
                return "Topic/EditTopicTyping.htm";
        }
        var TopicID = 0;
        function AddTopic() {
            var topicTypeID = -1;
            var node = tree.getSelected();

            if (node != null) {
                topicTypeID = parseInt(node.data.id);
                TopicID = 0;
                IsView = false;
                ShowDialog(GetEditPage(topicTypeID), "编辑", 900, 400);
            }
            else {
                showErrorTip("请先选择题型，在增加题目！");
                return;
            }
        }


        function EditTopic(id, typeID) {
            TopicID = id;
            IsView = false;
            ShowDialog(GetEditPage(typeID), "编辑", 900, 400);
        }

        function ViewTopic(id, typeID) {
            TopicID = id;
            IsView = true;
            ShowDialog(GetEditPage(typeID), "查看", 900, 400);
        }

        //修改题目状态
        function SetTopicSatus(id, status) {
            $("#layout1").mask("数据处理中，请稍候......");
            var params = { TopicID: id, Status: status, Rnd: Math.random() };
            $.post('../WebServer/TopicMng.ashx?Action=SetTopicStatus', params, function (msgData) {
                var data = eval("(" + msgData + ")");
                $("#layout1").unmask();
                if (data.IsSuccess == 1) {
                    //$grid.loadData(true); //加载数据
                    loadGrid();
                    showAlertOk("操作成功！");
                }
                else
                    showErrorTip("操作失败，请重试！");
            });
        }

        function Export() {
            //页面导出
            exportUrl = "../WebServer/DownloadExcel.ashx?Action=ExportTopic&beginDate=" + $("#txtBeginDate").val() + "&endDate=" + $("#txtBeginDate").val() +
            "&typeID=" + $("#typeID").val() + "&roleID=" + $("#roleID").val() + "&title=" + $("#txtTitle").val() + "&status=" + $("#lstStatus").val();
            window.open(exportUrl, "_blank");

        }
        function reflushTree(newdata) {
            var topicTypeID = $("#typeID").val();
            if (topicTypeID != 0) {
                if (tree != null) {
                    var pnode = $("#treePanel li[outlinelevel='1'][id='" + topicTypeID + "']");
                    $.each(newdata, function (i) {
                        var temp = this;
                        var isAdd = true;
                        $("li span", pnode).each(function (i, item) {

                            if ($.trim($(item).text()) == $.trim(temp.text)) {
                                isAdd = false;

                            }
                        });
                        if (isAdd) {
                            var nodes = [];

                            nodes.push({ text: temp.text, id: topicTypeID, role: temp.id });

                            tree.append(pnode, nodes);

                        }
                    });

                }

            }
        }
    </script>
    <style type="text/css">
        body
        {
            padding: 5px;
            margin: 0;
            padding-bottom: 15px;
        }
        #layout1
        {
            width: 100%;
            margin: 0;
            padding: 0;
        }
        .l-page-top
        {
            height: 80px;
            background: #f8f8f8;
            margin-bottom: 3px;
        }
        h4
        {
            margin: 20px;
        }
    </style>
</head>
<body style="padding: 10px">
    <div id="layout1">
        <div position="left" title="">
            <div id="treePanel" style="width: 100%; overflow: auto;">
                <ul id="tree">
                </ul>
            </div>
        </div>
        <!-- end-->
        <div position="center" title="">
            <table border="0" cellspacing="0" cellpadding="0" width="100%">
                <tr>
                    <td style="background: #E5EDEF; padding-left:5px;" width="80">起始日期</td>
                    <td style="padding-top:3px; background: #E5EDEF;" width="120"><input id="txtBeginDate" type="text" /></td>

                    <td style="background: #E5EDEF; padding-left:5px;" width="80">题目内容:</td>
                    <td style="padding-top:3px; background: #E5EDEF;" width="120"><input id="txtTitle" type="text" /></td>

                    <td rowspan="2" style="background: #E5EDEF; padding-left:5px; padding-right:5px;" width="80"><div class="l-button" style="width: 60px; height:40px; padding-top:13px;" onclick="Search()">查寻</div></td>

                    <td style="padding-top:3px; background: #E5EDEF;"><a class="l-button"style="width: 70px;" onclick="Export()">导出题目</a></td>
                </tr>
                <tr>
                    <td style="background: #E5EDEF; padding-left:5px;" width="80">结束日期</td>
                    <td style="padding-top:3px; background: #E5EDEF;" width="120"><span><input id="txtEndDate" type="text" /></span></td>

                    <td style="background: #E5EDEF; padding-left:5px;" width="80">题目状态:</td>
                    <td style="padding-top:3px; background: #E5EDEF;">
                        <select id="lstStatus" style="width:135px;">
                            <option value="-1" title="全部" selected="selected">全部</option>
                            <option value="0">启用</option>
                            <option value="1">停用</option>
                        </select>
                    </td>

                    <td style="padding-top:3px; background: #E5EDEF;"><a class="l-button" style="width: 70px;" onclick="AddTopic()">新建题目</a></td>
                </tr>
            </table>
            <div id="maingrid"></div>
        </div>
    </div>
    <input type="hidden" id="typeID" value="-1" />
    <input type="hidden" id="roleID" value="-1" />
</body>
</html>
